var flag = true; // 标记表单是否验证成功，js验证失败不能提交表单

$(document).ready(function () {
    console.log("regist js run, falg = " + flag);

    // 关联表单验证事件
    formVerify();

    // 提交表单
    submitForm();
});

// 关联表单验证事件
function formVerify() {

    // 用户名验证：失去焦点时
    $("#username").children("input").blur(function () {

        var value = $(this).val().trim(); // 去除空格
        if (value.length == 0) {
            $(this).next().text("用户名长度在5-25个字符之间");
            $(this).val("");
            flag = false;
        } else if (value.length < 5) {
            $(this).next().text("用户名过短，小于5个字符");
            flag = false;
        } else if (value.length > 25) {
            $(this).next().text("用户名过长，超过25个字符");
            flag = false;
        } else {
            $(this).next().text("符合要求");
            flag = true;
        }
    });

    // 密码验证：失去焦点时
    $("#password").children("input").blur(function () {

        var value = $(this).val().trim(); // 去除空格
        if (value.length == 0) {
            $(this).next().text("用户名长度在5-25个字符之间");
            $(this).val("");
            flag = false;
        } else if (value.length < 6) {
            $(this).next().text("用户名过短，小于6个字符");
            flag = false;
        } else if (value.length > 20) {
            $(this).next().text("用户名过长，超过20个字符");
            flag = false;
        } else {
            $(this).next().text("符合要求");
            flag = true;
        }
    });

    // 确认密码验证：失去焦点时
    $("#confirmPassword").children("input").blur(function () {
        console.log("confirmPassword input blur");

        var confirmValue = $(this).val().trim(); // 去除空格
        var password = $("#password").children("input").val().trim();

        if (confirmValue == password) {
            $(this).next().text("输入正确");
            flag = true;
        } else {
            $(this).next().text("两次输入密码不一致");
            flag = false;
        }
    });

    // 手机号码验证：失去焦点时
    $("#phone").children("input").blur(function () {
        console.log("phone input blur");

        var value = $(this).val().trim(); // 去除空格
        var pattern = /^1[34578]\d{9}$/; // 手机号码正则表达式

        if (value.length == 0) {
            $(this).next().text("请输入手机号码");
            $(this).val("");
            flag = false;
        } else if (value.length < 11) {
            $(this).next().text("手机号码小于11位");
            flag = false;
        } else if (value.length > 11) {
            $(this).next().text("手机号码超过11位");
            flag = false;
        } else if (!pattern.test(value)) {
            $(this).next().text("手机号码格式错误");
            flag = false;
        } else {
            $(this).next().text("符合要求");
            flag = true;
        }
    });

    // 邮箱验证：失去焦点时
    $("#email").children("input").blur(function () {
        console.log("email input blur");

        var value = $(this).val().trim(); // 去除空格
        var pattern = /^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/;

        if (value.length == 0) {
            $(this).next().text("请输入email");
            $(this).val("");
            flag = false;
        } else if (!pattern.test(value)) {
            $(this).next().text("email格式错误");
            flag = false;
        } else {
            $(this).next().text("符合要求");
            flag = true;
        }
    });

}

// 提交表单
function submitForm() {

    $("#submitBtn").click(function () {

        // 检查表单信息是否输入完整
        var values = $(".username").children("input");
        $.each(values, function () {
            var con = $(this).val().trim();
            console.log("con = " + con);
            if (!con || con.length == 0) {
                console.log("error con = " + con);
                flag = false;
            }
        });

        if (flag) {
            $("#registForm").submit(); // 进行注册表单提交
            console.log("表单提交");
        } else {
            alert("请完善表单信息之后再提交！, falg = " + flag);
        }
    });
}